<template>
  <div class="total">
    <div class="total1">
      <check-buttom
        :ischeck="checked"
        @click.native="checkClick"
        class="buttom"
      />
      <div class="total2">合计：￥{{ prices }}</div>
    </div>
    <div class="total3">去计算({{ newArrLenght }})</div>
  </div>
</template>

<script>
import checkButtom from "components/content/checkButtom.vue";
import { mapGetters } from "vuex";
export default {
  components: {
    checkButtom,
  },
  data() {
    return {
      checked: false,
      price: 0,
    };
  },
  computed: {
    ...mapGetters(["newArrLenght", "prices"]),
  },
  methods: {
    checkClick() {
      this.checked = !this.checked;
      this.$store.commit("allCheck", this.checked);
    },
  },
};
</script>

<style scoped>
.total {
  display: flex;
  height: 49px;
}
.total1 {
  flex: 7;
}

.total3 {
  line-height: 49px;
  flex: 3;
  background-color: crimson;
  text-align: center;
}
.total2 {
  line-height: 49px;
  display: inline-block;
}
.buttom {
  margin: 0 5px 0 5px;
  display: inline-block;
}
</style>
